<template>
  <div class="fd-menu-name fd-border">
    <template v-for="value in this.menuData">
      <el-submenu :index="value.name" v-if="value.items.length > 0" :key="value.text" >
        <template slot="title" class="fd-over">
          <div>
            <span slot="title">{{value.text}}</span>
          </div>
        </template>
        <el-menu-item-group>
            <MenuTree :menuData="value.items"></MenuTree>
        </el-menu-item-group>
      </el-submenu>
      <el-menu-item :index="value.name" :key="value.text" v-else>
        <span class="fd-menu-name-else" slot="title">
          <span class="fd-over">{{value.text}}</span>
        </span>
      </el-menu-item>
    </template>
  </div>
</template>
<script>
export default {
  props: ['menuData'],
  name: 'MenuTree',
  mounted () {
  }
}
</script>
<style scoped>

</style>



